// ajax请求，获取分类列表数据
function renderCategory() {
    $.ajax({
        url: '/my/category/list',
        success: function(res) {
            if (res.status === 0) {
                let arr = [];
                res.data.forEach(item => {
                        arr.push(`<tr>
              <td>${item.name}</td>
              <td>${item.alias}</td>
              <td>
                <button data-id="${item.id}" data-name="${item.name}" data-alias="${item.alias}" type="button" class="layui-btn layui-btn-xs">编辑</button>
                <button type="button" class="layui-btn layui-btn-danger layui-btn-xs">删除</button>
              </td>
            </tr>`);
                    })
                    // 循环结束，得到全部tr，把他们放到tbody里面
                $('tbody').html(arr.join(""));
            }
        }
    });
}

renderCategory();

// 


// 

// 添加类别
let addIndex;
// 点击添加分类，实现弹层
$('button:contains("添加类别")').on('click', function() {
    addIndex = layer.open({
        type: 1,
        title: '添加类别',
        content: $('#tpl-add').html(),
        area: ['500px', '250px']
    });
})

//  表单提交，完成添加
$('body').on('submit', '#add-form', function(e) {
        e.preventDefault();
        $.ajax({
            type: 'POST',
            url: '/my/category/add',
            data: $(this).serialize(),
            success: function(res) {
                // { status: 0, message: 'xxxx' }
                layer.msg(res.message);
                if (res.status === 0) {
                    renderCategory();
                    layer.close(addIndex);
                }
            }
        });
    })
    // 点击编辑按钮，实现弹出层
let form = layui.form;
let editIndex;
$('tbody').on('click', 'button:contains("编辑")', function() {
    let shuju = $(this).data();
    editIndex = layer.open({
        type: 1,
        title: '编辑分类',
        content: $('#tpl-edit').html(),
        area: ['500px', '250px'],
        success: function() {
            form.val('edit', data);
        }
    });
});
// 提交表单，完成编辑
$('body').on('submit', '#edit-form', function(e) {
    e.preventDefault();
    let shuju = $(this).serialize();
    // console.log(shuju);
    $.ajax({
        type: 'POST',
        url: '/my/category/update',
        data: shuju,
        success: function(res) {
            layer.msg(res.message);
            if (res.status === 0) {
                renderCategory();
                layer.close(editIndex);
            }
        }
    });
})